<template>
  <div class="CustomText" :style="styleItem">{{ dContent }}</div>
</template>
<script>
export default {
  name: 'CustomText',
  props: {
    content: {
      type: String,
      default: '请输入文本'
    },
    color: {
      type: String,
      default: '#000'
    },
    fontSize: {
      type: Number,
      default: 14
    },
    fontWeight: {
      type: Boolean,
      default: false
    },
    zIndex: {
      type: Number,
      default: 1
    }
  },
  data() {
    return {
      dContent: this.content
    }
  },
  watch: {
    content() {
      this.dContent = this.content
    },
  },
  computed: {
    styleItem() {
      return {
        color: this.color,
        fontSize: this.fontSize + 'px',
        fontWeight: this.fontWeight ? 'bold' : 'normal',
        zIndex: this.zIndex
      }
    }
  },
  methods: {
    
  },
}
</script>
<style lang="less">
  
</style>